*{
    padding: 0;
    margin: 0;
    text-decoration: none;
    /*取消列表的默认样式，如前面的小圆点*/
    list-style: none;
    box-sizing: border-box;
    /*锚点被点击，平滑滚动页面*/
    scroll-behavior: smooth;
    font-family:'Poppins',sans-serif;
}

/*head*/
.content {
    position: relative; /* 使用相对定位 */
    z-index: 1; /* 设置层叠顺序，使其在层叠上下文中处于较高的层级 */
    width: 100%; /* 宽度占满父容器 */
    height: 100vh; /* 高度占据视口的100% */
    background-image: linear-gradient(rgba(1, 0, 5, 0.3), rgba(4, 1, 17, 0.3)); /* 设置背景为线性渐变 */
}

nav .logo{
    width: 60px;
    margin: 2vh;
    margin-left: 8%;
}

nav{
    width: 100%;
    position: fixed;
    background-color: rgb(21,74,74);
    display: flex;
    /* 给导航栏添加阴影效果，阴影的位置偏移为水平5px，垂直5px，模糊半径为30px，颜色为RGBA值为(0, 0, 0, 15%)的带有15%不透明度的黑色。 */
    /*box-shadow: 5px 5px 30px rgba(0, 0, 0, 15%);*/
    justify-content: space-between;
    align-items: center;
}

nav ul li{
    display: inline-block;
    margin-left: 40px;
}

.navbar{
    display: flex;
    margin-right: 4vh;
}

.navbar a{
    color: white;
    font-size: 18px;
    padding: 10px 22px;
    border-radius: 4px;
    font-weight: 500;
    /* ease 表示过渡效果的速度曲线，它使得过渡在开始和结束时较慢，在中间部分较快，呈现出一种平滑的变化。0.40s 指定了过渡的持续时间 */
    transition: ease 0.40s;
}

.navbar a:hover,.navbar a.active{
    background: white;
    color: black;
    box-shadow: 5px 10px 30px rgb(85 85 85 / 20%);
    border-radius: 5px;

}

/*HomePage*/
.banner{
    width: 100%;
    height: 100vh;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
}

.banner video{
    /*  将视频元素设置为绝对定位，使其脱离文档流，并相对于其最近的已定位（position不是static）的祖先元素进行定位 */
    position: absolute;
    top: 0;
    left: 0;
    /* 设置视频元素的内容填充方式为覆盖，保持宽高比的同时填充整个容器，并裁剪超出部分 */
    object-fit: cover;
    width: 100%;
    height: 100%;
    /* 禁用鼠标事件，使得用户无法通过点击或者拖动视频元素触发事件 */
    pointer-events: none;
}

/*footer*/
.footer{
    margin-top: 80px;
    background: rgb(21,74,74);
}

.end{
    text-align: center;
    padding-top: 60px;
    padding-bottom: 12px;
}

.end p{
    font-size: 15px;
    color: white;
    letter-spacing: 1px;
    font-weight: 300;
}

/*login*/
.container{
    display: flex;
    justify-content: center;
    align-items: center;
}